<template>
    <el-row style="width: 100%">
		<div class="page-header">病例列表</div>
        <el-row :gutter="20">
            <el-col :xs="24" :sm="24" :md="24" :lg="11" style="height: auto">
                <wt-keyword-selector
                        style="width: 100%;float: left;margin-bottom: 10px"
                        v-model="input"
                        ref = 'select'
                ></wt-keyword-selector>
            </el-col>
            <el-col :xs="12" :sm="12" :md="12" :lg="6" class="button-div">
                <el-button style="float: right;" type="primary" icon="el-icon-plus" @click="newpatient">新建患者病例</el-button>
            </el-col>
            <el-col :xs="12" :sm="12" :md="12" :lg="6">
                <el-radio-group v-model="extraParam.mine" @change="cut">
                    <el-radio-button label="0">全部</el-radio-button>
                    <!-- <el-radio-button label="1">我的</el-radio-button> -->
                </el-radio-group>
            </el-col>
        </el-row>
		<!-- filter-param="定义接口过滤的字段名称" -->
            <!-- <wt-paged-table ref="table" v-loading="cutting" url="/api/record/form/list" :transfer="true" :refresh="true"
			url-method="GET"
			:filter="classify"  :initial-page="page" :total-size="10" :page-size="5" :extra-params="extraParam" @page-loaded="onPageLoaded">
                <wt-case-table :list="pageData">
                </wt-case-table>
            </wt-paged-table> -->
			<!-- <wt-paged-table url="/uaa/api/users/role-info-list" :initial-page="page" resultParam="content" countParam="totalElements" :page-size="5" size-param="pageSize" page-param="pageIndex" :extra-params="extraParams" @page-loaded="onPageLoaded" :filter="filter" :fetch="getAllUsers"> -->
			<wt-paged-table ref="table" v-loading="cutting"
			resultParam="content" countParam="totalElements"
			size-param="page_size" page-param="page_index"
			filter-param="query"
			:extra-params="extraParam"
			:fetch="getAllCases"
			:refresh="true"
			:filter="classify"   @page-loaded="onPageLoaded">
                <wt-case-table :list="pageData" :showName="false">
                </wt-case-table>
            </wt-paged-table>
			<check-patient-exist :visible.sync="visible" @on-ensure="ensure"></check-patient-exist>
    </el-row>
</template>
<script>
import Vue from "vue";
import WtPagedTable from "winged/components/wt-paged-table";
import AutoComplete from "../../componentsWithData/wt-keyword-selector";
import wtCaseTable from "../../componentsWithData/case-list-table";
import Permission from "winged/utils/wt-permission";
import DateFormat from "winged/utils/wt-time-utils";
import { getAllCases } from "../../utils/actions";
import checkPatientExist from "../../componentsWithData/check-patient-exist";

export default {
	components: {
		[WtPagedTable.name]: WtPagedTable,
		[AutoComplete.name]: AutoComplete,
		[wtCaseTable.name]: wtCaseTable,
		[checkPatientExist.name]: checkPatientExist
	},
	name: "wt-case-list",
	props: {
		page: {
			type: Number,
			default: 0
		},
		// 用于请求查询的额外参数数据，通常是_token
		extraParams: {
			type: Object,
			default: () => {}
		},
		info: {
			type: Object,
			default: function() {
				return {};
			}
		},
		filter: {
			type: String,
			default: ""
		},
		filterParam: {
			type: String,
			default: ""
		},
		multiSelect: {
			type: Boolean,
			default: true
		}
	},
	data() {
		return {
			getAllCases,
			visible: false,
			// 当前页的列表数据
			pageData: [],
			filtername: this.filterParam,
			input: "",
			classify: "",
			method: "POST",
			search: false,
			cutting: false,
			input: null,
			transfer: false,
			extraParam: {},
			allowEdit: Permission.checkPermission("patient-case-add"),
			allowRemove: Permission.checkPermission("patient-case-delete")
		};
	},
	computed: {
		patientBirthday: function() {
			return DateFormat.format(d, "date");
		}
	},
	mounted() {},
	methods: {
		newpatient() {
			this.visible = true;
		},
		ensure(isExit, patientId) {
			//跳转页面
			let path = isExit
				? `/case/create/${patientId}` //如果该patientId已经存在，则直接跳转到病例创建页面
				: `/patient/create/${patientId}`; //如果不存在，则跳转到患者创建页面，然后再跳转病例创建页面
			this.$router.push({ path });
		},
		onPageLoaded: function(data) {
			console.log("data", data);
			this.pageData = data;
			// if (this.search) {
			// 	this.pageData = data.cases;
			// } else {
			// 	this.pageData = data;
			// }
		},
		cut: function() {
			this.$refs.table.load();
		},
		editCase() {}
	},
	filters: {
		showsix: function(value) {
			return gender.formatGender(value);
		}
	}
};
</script>
<style scoped>
.button-div {
	padding-bottom: 15px;
	float: right;
}
.caseid {
	color: #999;
	float: left;
	margin-top: 10px;
	line-height: 21px;
	margin-left: 5px;
}
.table {
	width: 65%;
}
.table th {
	width: 30%;
	text-align: left;
}
.table td {
	width: 30%;
	text-align: left;
}
.basic {
	width: 100%;
	height: 40px;
	line-height: 40px;
	margin-bottom: 10px;
}
.six {
	margin-right: 2em;
}
.wt-header {
	width: 100%;
	display: block;
	margin: 0 0 10px 0;
}
.wt-header > * {
	display: inline-block;
	vertical-align: middle;
	margin: 4px 0 4px 0;
}
.wt-header h3 {
	margin: 0;
}
.wt-header span {
	margin-left: 10px;
}
.rightButtons {
	float: right;
	margin-top: 0;
}
</style>